﻿<template>
    <div class=" brand-box">
        <el-form>
            <table border="1" style="text-align: center  ; border-collapse: collapse">
                <tr>
                    <td style="width: 400px;height: 50px">
                        促销活动名称：
                        <el-input type="text"
                                  placeholder="录入促销活动名称"
                                  v-model="PromotionInfo.promotionName"
                                  style="width: 250px"
                                  maxlength="20" show-word-limit>
                        </el-input>
                    </td>
                    <td style="width: 400px">
                        促销活动开始时间：
                        <el-date-picker v-model="PromotionInfo.promotionStarttime" type="datetime"
                                        placeholder="选择日期时间">
                        </el-date-picker>
                    </td>
                    <td style="width: 400px">
                        促销活动结束时间：
                        <el-date-picker v-model="PromotionInfo.promotionStoptime" type="datetime"
                                        placeholder="选择日期时间">
                        </el-date-picker>
                    </td>
                    <td style="width: 400px">
                        促销类型：
                        <el-radio-group v-model="PromotionInfo.promotionType">
                            <el-radio :label="1">每日限量</el-radio>
                            <el-radio :label="2">连续促销</el-radio>
                        </el-radio-group>
                    </td>
                </tr>
                <tr>
                    <td colspan="4" style="height: 50px">
                        <el-button round type="primary" @click="selectedGood = true">选择商品</el-button>
                    </td>
                </tr>
                <tr >
                    <td colspan="3">
                        <el-table :data="goodInfo3" style="width: 100%">
                            <el-table-column fixed prop="goodId" label="商品id" width="200"></el-table-column>
                            <el-table-column prop="goodName" label="商品名字" width="300"></el-table-column>
                            <el-table-column prop="goodStock" label="商品库存数量" width="200"></el-table-column>
                            <el-table-column prop="goodMarketprice" label="市场价" width="200"></el-table-column>
                            <el-table-column prop="goodMallprice" label="商城价" width="200"></el-table-column>
                        </el-table>
                    </td>
                    <td style="height: 200px;">
                        <template>促销数量：
                            <el-input v-model="PromotionInfo.promotionNum" placeholder="请输入" style="width: 170px">
                            </el-input>
                        </template>
                        <br>
                        <template>调价方式：
                            <el-select v-model="PromotionInfo.adiustPriceWay" placeholder="请选择">
                                <el-option label="绝对值" :value="1"></el-option>
                                <el-option label="百分比" :value="2"></el-option>
                            </el-select>
                        </template>
                        <br>

                        <template>促销价格：
                            <el-input v-model="PromotionInfo.promotionPrice" placeholder="输入促销价格"
                                      style="width: 170px"
                                      :disabled="PromotionInfo.adiustPriceWay ==2">
                            </el-input>
                        </template>
                        <br>
                        <template>百分比：
                            <el-input v-model="PromotionInfo.percent" placeholder="百分比"
                                      maxlength="20" show-word-limit
                                      style="width: 170px"
                                      :disabled="PromotionInfo.adiustPriceWay ==1"></el-input>
                        </template>
                    </td>
                </tr>
                <tr style="height: 50px">
                    <td colspan="2">
                        促销价格生效时间：
                            <el-date-picker v-model="PromotionInfo.priceTaketime"
                                            type="datetime"
                                            placeholder="选择日期时间">
                            </el-date-picker>
                    </td>
                    <td colspan="2">
                        促销价格失效时间：
                            <el-date-picker v-model="PromotionInfo.priceLosetime"
                                            type="datetime"
                                            placeholder="选择日期时间">
                            </el-date-picker>
                    </td>
                </tr>
                <tr>
                    <td colspan="4" style="height: 230px">
                        活动策划文件：
                            <el-upload drag action="https://jsonplaceholder.typicode.com/posts/" multiple>
                                <i class="el-icon-upload"></i>
                                <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
                            </el-upload>
                    </td>
                </tr>
                <tr>
                    <td colspan="4" style="height: 130px">
                        备注信息：
                            <el-input type="textarea" v-model="PromotionInfo.promotionRemarks"
                                      style="width: 500px"
                                      maxlength="200" show-word-limit
                                      :rows="4">
                            </el-input>
                    </td>
                </tr>
                <tr>
                    <td colspan="4" style="height: 50px">
                            <el-button round type="primary" @click="addPromotion">保存</el-button>
                            <el-button round type="info" @click="backtrack">返回</el-button>
                    </td>
                </tr>
            </table>
        </el-form>


        <div>
            <el-dialog title="商品选择" :visible.sync="selectedGood" findGood>
                <div class="good">
                    <div class="good_head">
                        <el-form :inline="true">
                            <el-form-item label="商品名称：">
                                <el-input v-model="findGoodInfo.goodName" placeholder="商品名称"
                                          style="width: 200px"></el-input>
                            </el-form-item>

                            <el-form-item label="商品型号：">
                                <el-input v-model="findGoodInfo.goodModel" placeholder="商品型号"
                                          style="width: 200px"></el-input>
                            </el-form-item>

                            <el-form-item label="商品颜色：">
                                <el-input v-model="findGoodInfo.goodColour" placeholder="商品颜色"
                                          style="width: 200px"></el-input>
                            </el-form-item>

                            <el-form-item label="商品品牌：">
                                <el-input v-model="findGoodInfo.goodBrandid" placeholder="商品品牌"
                                          style="width: 200px"></el-input>
                            </el-form-item>
                            <br>

                            <el-form-item>
                                <el-button round type="primary" @click="findGood">查询</el-button>
                                <el-button round type="primary" @click="restd">重置</el-button>
                            </el-form-item>
                        </el-form>
                    </div>

                    <div class="good_show">
                        <el-table :data="goodInfo" height="350px" style="align-content: center">
                            <el-table-column fixed prop="goodId" label="序号" width="80"></el-table-column>
                            <el-table-column prop="goodName" label="商品名字" width="150"></el-table-column>
                            <el-table-column prop="promotionStarttime" label="商品类型" width="150"></el-table-column>
                            <el-table-column prop="goodMarketprice" label="商品单价" width="150"></el-table-column>
                            <el-table-column prop="goodBrandid" label="商品品牌" width="120"></el-table-column>
                            <el-table-column prop="goodModel" label="商品型号" width="150"></el-table-column>
                            <el-table-column prop="goodSum" label="商品数量" width="120"></el-table-column>
                            <el-table-column prop="goodColorid" label="商品颜色" width="120"></el-table-column>
                            <el-table-column fixed="right" prop="handle" label="操作" width="120">
                                <template v-slot="indexid">
                                    <el-button round type="primary" icon="el-icon-document-copy" size="mini"
                                               @click="affirm(indexid.row.goodId)">选择
                                    </el-button>
                                </template>
                            </el-table-column>
                        </el-table>
                    </div>

                    <div class="good_page">
                        <el-pagination background
                                       :current-page="findGoodInfo.current"
                                       :page-size="findGoodInfo.size"
                                       layout="prev, pager, next"
                                       @current-change="pagefindgood"
                                       :total="totalPage">
                        </el-pagination>
                    </div>
                    <div slot="footer" class="good_butt">
                        <el-button type="primary" @click="selectedGood = false">返 回</el-button>
                    </div>
                </div>
            </el-dialog>
        </div>
    </div>
</template>

<script>
    import brand from './PromotionApply'

    export default brand;
</script>

<style scoped lang="sass">
    @import "PromotionApply"
</style>